/*eslint-disable*/
<!--
   * @author  dumeng
人员管理
-->
/*eslint-enable*/
<template>
  <el-container id="enterpriseuser">
    <split-pane split="vertical" :min-percent="0" :default-percent="28">
      <template slot="paneL">
        <div class="treeBox leftWrap">
          <div class="search-tree-wrap">
            <el-input
              v-model.trim="treeName"
              style="width:75%"
              placeholder="组织名称搜索"
              class="search-input"
              clearable
              @clear="clearSearchTree"
            />
            <el-button class="filter-item tree-filter" type="primary" @click="handleFilterTree">搜索</el-button>
          </div>
          <el-tree
            v-if="!issearchtree "
            ref="qytree"
            key="lodTree"
            v-loading="treeLoading"
            :data="treeData"
            :props="defaultProps"
            :expand-on-click-node="false"
            :filter-node-method="filterNode"
            class="dictTree"
            highlight-current
            :default-expanded-keys="[treeData.length>0 && treeData[0].id]"
            :load="loadtree"
            node-key="id"
            lazy
            @node-click="handleNodeClick"
          >
            <span slot-scope="{ node }" class="custom-tree-node">
              <span>{{ node.label }}</span>
            </span>
          </el-tree>
          <el-tree
            v-if="issearchtree"
            ref="qytree"
            key="newTree"
            v-loading="treeLoading"
            :data="treeData"
            :expand-on-click-node="false"
            :props="defaultProps"
            default-expand-all
            class="dictTree"
            highlight-current
            @node-click="handleNodeClick"
          >
            <span slot-scope="{ node }" class="custom-tree-node">
              <span>{{ node.label }}</span>
              <!--					 			<span
                    :class="['tag', data.type==='JGLX01'?'gh':data.type==='JGLX02'?'qy':data.type===''?'bm':'']">{{
                    data.typeValue || ''
                  }}</span>-->
            </span>
          </el-tree>
        </div>
      </template>
      <template slot="paneR">
        <el-main class="user-main">
          <div v-if="!isShow" class="ts-con">
            <div class="ts">
              <i class="el-icon-info" />
              <span v-html="showMsg" />
            </div>
          </div>
          <div v-else id="enterprise-usermanage">
            <el-collapse-transition>
              <div v-show="searchshow" class="course-search merge">
                <span class="svg-container">
                  <svg-icon icon-class="search" />
                </span>
                <el-input
                  v-model.trim="listQuery.commonParam"
                  placeholder="请输入关键字搜索"
                  class="search-input"
                  @keyup.enter.native="handleFilter"
                />
                <div class="course-search-btn">
                  <el-button class="filter-item" type="primary" @click="handleFilter">搜索</el-button>
                  <el-button class="filter-item" type="primary" @click="resettingBtn">重置</el-button>
                  <span class="course-search-more" @click="searchshow = !searchshow">
                    更多筛选条件
                    <i class="el-icon-arrow-down" />
                  </span>
                </div>
              </div>
            </el-collapse-transition>
            <el-collapse-transition>
              <div v-show="!searchshow" class="course-search separate">
                <div class="course-search-inner">
                  <el-row>
                    <!--<el-col :span="8">
                      <div class="search-inner-item">
                        <div class="item-label">用户名</div>
                        <el-input v-model.trim="search.userName" style="width: 90%;" class="filter-item" placeholder="请输入用户名搜索" />
                      </div>
                    </el-col>-->
                    <el-col :span="8">
                      <div class="search-inner-item">
                        <div class="item-label">真实姓名</div>
                        <el-input
                          v-model.trim="search.userRealname"
                          style="width: 90%;"
                          class="filter-item"
                          placeholder="请输入真实姓名搜索"
                        />
                      </div>
                    </el-col>
                    <el-col :span="8">
                      <div class="search-inner-item">
                        <div class="item-label">联系电话</div>
                        <el-input
                          v-model.trim="search.phoneNumber"
                          maxlength="11"
                          style="width: 90%;"
                          class="filter-item"
                          placeholder="请输入联系电话搜索"
                        />
                      </div>
                    </el-col>
                    <el-col :span="8">
                      <div class="search-inner-item">
                        <div class="item-label">证件号码</div>
                        <el-input
                          v-model.trim="search.userIdnumber"
                          style="width: 90%;"
                          class="filter-item"
                          placeholder="请输入完整证件号码"
                        />
                      </div>
                    </el-col>
                    <!--<el-col :span="8">
                      <div class="search-inner-item">
                        <div class="item-label">状态</div>
                        <el-checkbox-group v-model="search.status" style="margin-top:15px;">
                          <el-checkbox v-for="v in dict.YHZT" :key="v.dictValue" :label="v.dictValue">{{ v.dictName }}</el-checkbox>
                        </el-checkbox-group>
                      </div>
                    </el-col>-->
                    <el-col :span="8">
                      <div class="search-inner-item">
                        <div class="item-label">入会开始时间</div>
                        <el-date-picker
                          v-model="search.startTime"
                          style="padding-left:10%"
                          type="datetime"
                          placeholder="请选择"
                          value-format="yyyy-MM-dd HH:mm:ss"
                        />
                      </div>
                    </el-col>
                    <el-col :span="8">
                      <div class="search-inner-item">
                        <div class="item-label">入会结束时间</div>
                        <el-date-picker
                          v-model="search.endTime"
                          style="padding-left:10%"
                          value-format="yyyy-MM-dd HH:mm:ss"
                          type="datetime"
                          placeholder="请选择"
                        />
                      </div>
                    </el-col>
                    <el-col :span="8">
                      <div class="search-inner-item">
                        <div class="item-label">类型</div>
                        <el-checkbox-group v-model="search.adminFlag" style="margin-top:15px;">
                          <el-checkbox v-for="v in dict.YHBS" :key="v.dictValue" :label="v.dictValue">
                            {{ v.dictName }}
                          </el-checkbox>
                        </el-checkbox-group>
                      </div>
                    </el-col>
                  </el-row>
                  <el-row>
                    <!-- <el-col :span="16">
                      <div class="search-inner-item">
                        <div class="item-label">会员状态</div>
                        <el-radio-group v-model="search.memberStatus">
                          <el-radio v-for="v in dict.HYZT" :key="v.dictValue" :label="v.dictValue">
                            {{ v.dictName }}
                          </el-radio>
                        </el-radio-group>
                        <el-checkbox-group v-model="search.memberStatus">
                          <el-checkbox v-for="v in dict.HYZT" :key="v.dictValue" :label="v.dictValue">{{ v.dictName }}</el-checkbox>
                        </el-checkbox-group>
                      </div>
                    </el-col> -->
                    <el-col :span="7">
                      <div class="search-inner-item">
                        <div class="item-label">认证状态</div>
                        <el-radio-group v-model="search.isAuth">
                          <el-radio label="RZZT03">已认证</el-radio>
                          <el-radio label="RZZT01">未认证</el-radio>
                        </el-radio-group>
                      </div>
                    </el-col>
                  </el-row>
                </div>
                <div class="course-search-btn">
                  <el-button type="primary" @click="handleFilter">搜索</el-button>
                  <el-button class="filter-item" type="primary" @click="resettingBtn">重置</el-button>
                  <span class="course-search-more" @click="searchshow = !searchshow">
                    精简筛选条件
                    <i class="el-icon-arrow-up" />
                  </span>
                </div>
              </div>
            </el-collapse-transition>
            <div class="btn-container">
              <div class="btn-container-title">
                <span>人员管理</span>
                <span v-if="currentNode.name">
                  <span v-if="breadList.length > 0">,当前选择</span>
                  <span
                    v-if="breadList.length"
                    class="btn-container-title-select"
                    :title="breadList.join('>')"
                  >{{ breadList.join('>') }}</span>
                </span>
              </div>
              <div class="btn-container-btns">
                <el-button
                  v-permission="'personmanageInsert'"
                  class="filter-item"
                  style="margin-left: 10px;"
                  @click="handleCreate"
                >新建用户
                </el-button>
                <el-button class="filter-item" style="margin-left: 10px;" @click="handleDownload">模版下载
                </el-button>
                <el-button class="filter-item" style="margin-left: 10px;" @click="handleUpload">
                  {{ currentNode.deptId ? '按部门导入' : '批量导入' }}
                </el-button>
                <el-button style="margin-left: 10px" @click="handleExport">导出人员</el-button>
                <el-button
                  v-permission="'personmanageDeletes'"
                  class="filter-item"
                  style="margin-left: 10px;"
                  @click="handleDeletes"
                >批量删除
                </el-button>
              </div>
            </div>
            <div class="table">
              <el-table
                ref="rolemantable"
                v-loading="listLoading"
                :data="list"
                class="tableScope"
                style="width: 100%"
                @selection-change="handleSelectionChange"
              >
                <el-table-column type="selection" width="55" />
                <!--<el-table-column prop="userName" label="用户名" show-overflow-tooltip />-->
                <el-table-column prop="userRealname" label="真实姓名" show-overflow-tooltip width="130" />
                <el-table-column prop="deptName" label="所属部门" show-overflow-tooltip width="200" />
                <el-table-column prop="phoneNumber" label="联系电话" show-overflow-tooltip width="130">
                  <template slot-scope="scope">
                    <span>{{ handleDecrypt(scope.row.phoneNumber) }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="userSexName" label="性别" show-overflow-tooltip />
                <el-table-column prop="userIdnumber" label="证件号码" width="200" show-overflow-tooltip>
                  <template slot-scope="scope">
                    <span>{{ handleDecrypt(scope.row.userIdnumber) }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="userEmail" label="邮箱" width="200" show-overflow-tooltip />
                <el-table-column prop="isAuthName" label="是否认证" width="80" show-overflow-tooltip />
                <el-table-column prop="joinMemberTime" label="入会时间" show-overflow-tooltip width="130">
                  <template slot-scope="scope">
                    <span>{{
                      scope.row.joinMemberTime && scope.row.joinMemberTime.length > 10 ? scope.row.joinMemberTime.substring(0, 10) : ''
                    }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="isSingleName" label="是否单身" width="80" show-overflow-tooltip />
                <el-table-column prop="adminFlagName" label="类型" show-overflow-tooltip>
                  <template slot-scope="scope">
                    <span>{{ scope.row.adminFlagName }}</span>
                    <!-- <span>{{ getlabelBycode("YHBS", scope.row.adminFlag) }}</span> -->
                  </template>
                </el-table-column>
                <el-table-column prop="lockStatusName" label="锁定状态" show-overflow-tooltip>
                  <template slot-scope="scope">
                    <span>{{ scope.row.lockStatusName }}</span>
                    <!-- <span>{{ getlabelBycode("SDZT", scope.row.lockStatus) }}</span> -->
                  </template>
                </el-table-column>
                <el-table-column prop="statusName" label="用户状态" width="80" show-overflow-tooltip>
                  <template slot-scope="scope">
                    <span>{{ scope.row.statusName }}</span>
                    <!-- <span>{{ getlabelBycode("YHZT", scope.row.lockStatus) }}</span> -->
                  </template>
                </el-table-column>
                <!-- <el-table-column prop="memberStatusValue " label="会员状态" width="80" show-overflow-tooltip>
                  <template slot-scope="scope">
                    <span>{{ scope.row.memberStatusValue }}</span>
                    <span>{{ getlabelBycode("YHZT", scope.row.lockStatus) }}</span>
                  </template>
                </el-table-column> -->
                <el-table-column
                  label="操作"
                  fixed="right"
                  align="center"
                  width="200"
                  class-name="small-padding fixed-width"
                >
                  <template slot-scope="scope">
                    <el-button
                      v-permission="'personmanageUpdate'"
                      type="text"
                      size="mini"
                      @click="handleUpdate(scope.row)"
                    >编辑
                    </el-button>
                    <!-- <el-button
                      v-permission="'personmanageUpdate'"
                      type="text"
                      size="mini"
                      @click="queryStatus(scope.row)"
                    >会员状态
                    </el-button> -->
                    <el-button
                      v-permission="'personmanageDelete'"
                      type="text"
                      size="mini"
                      @click="handleDelete(scope.row)"
                    >删除
                    </el-button>
                    <el-button
                      v-permission="'personmanagePassword'"
                      type="text"
                      size="mini"
                      @click="handlePassword(scope.row)"
                    >重置密码
                    </el-button>
                    <el-button
                      v-permission="'personmanageLock'"
                      type="text"
                      size="mini"
                      @click="handleUnlock(scope.row)"
                    >
                      {{ scope.row.lockStatus == 'SDZT02' ? '解锁' : (scope.row.lockStatus == 'SDZT01' ? "锁定" : '') }}
                    </el-button>
                    <!--                    <el-button
                      v-if="scope.row.adminFlag ==='YHBS02'"
                      type="text"
                      size="mini"
                      @click="handleAuthority(scope.row)"
                    >权限
                    </el-button>-->
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div class="btn-pagion fix">
              <pagination
                v-show="total>0"
                :total="total"
                :page.sync="listQuery.page"
                :limit.sync="listQuery.limit"
                @pagination="getList"
              />
            </div>
            <el-dialog
              v-el-drag-dialog
              :close-on-click-modal="false"
              :title="textMap[dialogStatus]"
              :visible.sync="dialogFormVisible"
              center
              width="600px"
              top="10vh"
            >
              <el-form
                ref="dataForm"
                :model="temp"
                :rules="rules"
                class="dataForm"
                label-position="right"
                label-width="107px"
                style="padding-right: 10px;height:400px;overflow: auto;"
              >
                <el-form-item label="真实姓名" prop="userRealname">
                  <el-input v-model.trim="temp.userRealname" placeholder="请输入真实姓名" maxlength="20" show-word-limit />
                </el-form-item>
                <el-form-item label="证件类型" prop="idType">
                  <el-select v-model="temp.idType" :readonly="dialogStatus==='update'|| temp.virtualAccount === 'yes'" placeholder="请选择证件类型">
                    <el-option
                      v-for="(item, index) in dict.ZJLX"
                      :key="index"
                      :label="item.dictName"
                      :value="item.dictValue"
                    />
                  </el-select>

                </el-form-item>
                <el-form-item label="证件号码" prop="userIdnumber">
                  <el-input v-model.trim="temp.userIdnumber" :readonly="dialogStatus==='update'" placeholder="请输入证件号码" @blur="setSex">
                    <el-button v-if="dialogStatus==='update'" slot="append" icon="el-icon-edit" @click="openIdnumberVisible" />
                  </el-input>
                </el-form-item>
                <el-form-item label="选择组织" required>
                  <el-button @click="OpenOrgTreedialog">{{ selectOrgTree[0].name || '请选择组织' }}</el-button>
                </el-form-item>
                <el-form-item label="联系电话" prop="phoneNumber">
                  <el-input
                    v-model.trim="temp.phoneNumber"
                    maxlength="11"
                    :readonly="dialogStatus==='update'"
                    placeholder="请输入联系电话"
                  >
                    <el-button v-if="dialogStatus==='update'" slot="append" icon="el-icon-edit" @click="updatePhoneNumber(temp)" />
                  </el-input>
                </el-form-item>
                <el-form-item label="性别" prop="userSex">
                  <el-radio-group v-model="temp.userSex" @change="handleToggleSex">
                    <el-radio v-for="v in dict.XB" :key="v.dictValue" :label="v.dictValue">{{ v.dictName }}
                    </el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="邮箱" prop="userEmail">
                  <el-input v-model.trim="temp.userEmail" placeholder="请输入邮箱" />
                </el-form-item>
                <el-form-item label="是否认证" prop="isAuth">
                  <el-radio-group v-model="temp.isAuth">
                    <el-radio label="RZZT03">是</el-radio>
                    <el-radio label="RZZT01">否</el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item v-if="temp.isAuth === 'RZZT03'" label="入会时间" prop="joinMemberTime">
                  <el-date-picker
                    v-model="temp.joinMemberTime"
                    type="date"
                    placeholder="请选择"
                    style="width: 100%"
                    format="yyyy-MM-dd"
                    value-format="yyyy-MM-dd HH:mm:ss"
                  />
                </el-form-item>
                <el-form-item v-if="temp.isAuth === 'RZZT03'" label="部门" prop="department">
                  <!-- <el-input v-model.trim="temp.department" placeholder="请输入部门" maxlength="20" show-word-limit /> -->
                  <el-select v-model="temp.department" placeholder="请选择部门">
                    <el-option
                      v-for="item in departmentOptions"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="婚姻状况" prop="maritalStatus">
                  <el-radio-group v-model="temp.maritalStatus">
                    <el-radio v-for="v in dict.HYZK" :key="v.dictValue" :label="v.dictValue">
                      {{ v.dictName }}
                    </el-radio>
                  </el-radio-group>
                </el-form-item>
                <!-- <el-form-item v-if="dialogStatus==='create'" label="会员状态" prop="memberStatus">
                  <el-radio-group v-model="temp.memberStatus ">
                    <el-radio v-for="v in dict.HYZT" :key="v.dictValue" :label="v.dictValue">
                      {{ v.dictName }}
                    </el-radio>
                  </el-radio-group>
                </el-form-item> -->
                <!-- <el-form-item label="用户岗位" prop="userJob">
                  <el-radio-group v-model="temp.userJob ">
                    <el-radio v-for="v in dict.YHGW" :key="v.dictValue" :label="v.dictValue">
                      {{ v.dictName }}
                    </el-radio>
                  </el-radio-group>
                </el-form-item> -->
                <el-form-item label="类型" prop="adminFlag">
                  <el-radio-group v-model="temp.adminFlag">
                    <el-radio v-for="v in dict.YHBS" :key="v.dictValue" :label="v.dictValue">
                      {{ v.dictName }}
                    </el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="锁定状态" prop="lockStatus">
                  <el-radio-group v-model="temp.lockStatus">
                    <el-radio v-for="v in dict.SDZT" :key="v.dictValue" :label="v.dictValue">
                      {{ v.dictName }}
                    </el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="状态" prop="status">
                  <el-radio-group v-model="temp.status">
                    <el-radio v-for="v in dict.YHZT" :key="v.dictValue" :label="v.dictValue">
                      {{ v.dictName }}
                    </el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button style="padding: 8px 30px;" @click="dialogFormVisible = false">取消</el-button>
                <el-button
                  style="padding: 8px 30px;"
                  type="primary"
                  @click="dialogStatus==='create'?createData():updateData()"
                >确定
                </el-button>
              </div>
            </el-dialog>
            <el-dialog
              v-el-drag-dialog
              :close-on-click-modal="false"
              :title="'批量导入'"
              :visible.sync="uploadVisible"
              center
              width="450px"
            >
              <el-form style="padding-left: 22px;">
                <el-form-item label="是否为认证用户">
                  <el-radio-group v-model="uploadData.isAuth">
                    <el-radio label="RZZT03">是</el-radio>
                    <el-radio label="RZZT01">否</el-radio>
                  </el-radio-group>
                </el-form-item>
                <p style="color: red;text-align:left;padding: 0px;">
                  {{ currentNode.deptId ? '不判定表格中的部门信息，默认导入选中的部门' : '根据表格中的部门名称，将人员导入到对应部门' }}
                </p>
              </el-form>

              <el-upload
                ref="upload"
                v-loading="loadingUpload"
                element-loading-text="正在导入请稍后"
                element-loading-spinner="el-icon-loading"
                element-loading-background="rgba(0, 0, 0, 0.8)"
                :auto-upload="false"
                :on-success="uploadSuccess"
                :on-error="uploadError"
                :action="uploadaction"
                :headers="uploadHeaders"
                :data="uploadData"
                accept=".xls, .xlsx"
                class="upload-model"
                drag
                multiple
              >
                <i class="el-icon-upload" />
                <div class="el-upload__text">
                  将文件拖到此处，或
                  <em>点击导入</em>
                </div>
                <div slot="tip" class="el-upload__tip">未设置初始密码，为了用户账号安全，请尽快联系用户设置密码～
                  <br>
                  <br>
                </div>
              </el-upload>
              <div slot="footer" class="dialog-footer">
                <el-button style="padding: 8px 30px;" @click="uploadVisible = false">取消</el-button>
                <el-button style="padding: 8px 30px;" type="primary" @click="uploadSubmit">确定</el-button>
              </div>
            </el-dialog>
            <el-dialog
              v-el-drag-dialog
              :close-on-click-modal="false"
              :title="'重置密码'"
              :visible.sync="passwordVisible"
              center
              width="450px"
            >
              <el-form
                ref="infoForm"
                class="upPassword"
                :rules="inforules"
                :model="info"
                label-position="right"
                label-width="100px"
                style="width: 400px;height:110px;"
              >
                <el-form-item label="密码:" prop="password">
                  <el-input v-model.trim="info.password" :type="isPassword ? 'password' : 'text'" placeholder>
                    <i
                      v-if="info.password"
                      slot="suffix"
                      :class="isPassword ? 'hide' : 'show'"
                      @click="changePasswordType"
                    />
                  </el-input>
                </el-form-item>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button style="padding: 8px 30px;" @click="passwordVisible = false">关闭</el-button>
                <el-button type="primary" style="padding: 8px 30px;" @click="updatepassword()">确定</el-button>
              </div>
            </el-dialog>
            <el-dialog
              v-el-drag-dialog
              :close-on-click-modal="false"
              title="选择组织"
              :visible.sync="OrgTreedialog"
              width="480px"
              center
            >
              <org-tree ref="showOrgTree" @selectOrgTree="selectOrg" />
              <div slot="footer" class="dialog-footer">
                <el-button style="padding: 8px 30px;" @click="OrgTreedialog = false">取消</el-button>
                <el-button style="padding: 8px 30px;" type="primary" @click="saveOrg">确定</el-button>
              </div>
            </el-dialog>

            <!-- 查看签名的弹窗 -->
            <el-dialog
              v-el-drag-dialog
              :close-on-click-modal="false"
              title="查看签名"
              :visible.sync="showImage"
              width="480px"
              center
              class="image-preview"
            >
              <el-image
                class="image-box"
                :src="url"
                :preview-src-list="[url]"
                :z-index="99999"
              />
              <div slot="footer" class="dialog-footer">
                <el-button style="padding: 8px 30px;" @click="showImage = false">取消</el-button>
              </div>
            </el-dialog>
            <!-- 会员状态显示弹窗 -->
            <el-dialog
              v-el-drag-dialog
              :close-on-click-modal="false"
              title="会员状态"
              :visible.sync="statusVisible"
              center
              width="600px"
              top="10vh"
            >
              <el-form
                ref="personStatus"
                :model="personStatus"
                :rules="personStatusRules"
                class="dataForm"
                label-position="right"
                label-width="107px"
                style="padding-right: 10px;overflow: auto;"
              >
                <el-form-item label="当前状态：">
                  <span style="color:red;">{{ personStatus.status || '未知' }}</span>
                </el-form-item>
                <el-form-item label="变更状态：" prop="memberStatus">
                  <el-radio-group v-model="personStatus.memberStatus">
                    <el-radio v-for="v in dict.HYZT" :key="v.dictValue" :label="v.dictValue">
                      {{ v.dictName }}
                    </el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="变更时间：" prop="memberUpdateTime">
                  <el-date-picker
                    v-model="personStatus.memberUpdateTime"
                    type="date"
                    placeholder="请选择"
                    style="width: 100%"
                    format="yyyy-MM-dd"
                    value-format="yyyy-MM-dd HH:mm:ss"
                  />
                </el-form-item>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button style="padding: 8px 30px;" @click="statusVisible = false">取消</el-button>
                <el-button
                  style="padding: 8px 30px;"
                  type="primary"
                  @click="handleChangeStatus"
                >确定
                </el-button>
              </div>
            </el-dialog>
            <!--  可管理部门列表      -->
            <authority v-if="showDetail" :user-id="selectItem.id" @cancel="handleCancel" />
            <!-- 编辑证件号码、证件类型、性别弹窗-->
            <el-dialog
              v-el-drag-dialog
              title="修改"
              append-to-body
              center
              :close-on-click-modal="false"
              :visible.sync="dialogIdnumberVisible"
            >
              <el-form
                ref="idnumberForm"
                :model="temp4Idnumber"
                :rules="rules4Idnumber"
                class="dataForm"
                label-position="right"
                label-width="107px"
                style="padding-right: 10px;height:200px;overflow: auto;"
              >
                <el-form-item label="证件类型" prop="idType">
                  <el-select v-model="temp4Idnumber.idType" placeholder="请选择证件类型">
                    <el-option
                      v-for="(item, index) in dict.ZJLX"
                      :key="index"
                      :label="item.dictName"
                      :value="item.dictValue"
                    />
                  </el-select>
                </el-form-item>
                <el-form-item label="证件号码" prop="userIdnumber">
                  <el-input v-model.trim="temp4Idnumber.userIdnumber" placeholder="请输入证件号码" @blur="setSex" />
                </el-form-item>
                <el-form-item label="性别" prop="userSex">
                  <el-radio-group v-model="temp4Idnumber.userSex" @change="handleToggleSex">
                    <el-radio v-for="v in dict.XB" :key="v.dictValue" :label="v.dictValue">{{ v.dictName }}
                    </el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button style="padding: 8px 30px;" @click="dialogIdnumberVisible = false">取消</el-button>
                <el-button
                  style="padding: 8px 30px;"
                  type="primary"
                  @click="updateIdnumber"
                >确定
                </el-button>
              </div>
            </el-dialog>
          </div>
        </el-main>
      </template>
    </split-pane>
  </el-container>
</template>

<script>
import splitPane from 'vue-splitpane'
import {
  getComAndOrgTree,
  getUserList,
  del,
  update,
  create,
  getDetail,
  updatePassword,
  getDictByCode,
  roleListByName,
  exportUser,
  noMaskExportUser,
  upDataStatusPerson,
  updatePhone,
  updateIdnumber,
  getPhoneNumberIsShow,
  getIdNumberIsShow
} from '@/views/personmanage/api/index'
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
import {
  phone,
  password,
  specialText,
  validateEmail
} from '@/utils/validate'
import {
  getToken
} from '@/utils/auth'
import CryptoJS from '@/utils/aesJiaJM'
import permission from '@/directive/permission/index.js' // 权限判断指令
import elDragDialog from '@/directive/el-drag-dialog' // base on element-ui
import OrgTree from '@/views/personmanage/components/orgtree' // Secondary package based on el-pagination
import Authority from '@/views/personmanage/components/authority'
import { exportSign, importSign } from '@/utils/fileImportOrExportSign'
import { parseTime } from '@/utils/index'
import { exportCheck } from '@/utils/sensitiveInfoExportCheck'
export default {
  name: 'Enterpriseuser',
  components: {
    Pagination,
    OrgTree,
    splitPane,
    Authority
  },
  directives: {
    permission,
    elDragDialog
  },
  data() {
    return {
      loadingUpload: false,
      OrgTreedialog: false,
      isShow: false,
      isPassword: true,
      issearchtree: false,
      showMsg: '单击左侧菜单项进行维护',
      getVisible: false,
      treeLoading: false,
      passwordVisible: false,
      info: {
        id: '',
        password: ''
      },
      listQuery: {
        page: 1,
        limit: 10,
        commonParam: '',
        isSearch: 0
      },
      searchshow: true,
      search: {
        userName: '',
        userRealname: '',
        phoneNumber: '',
        userIdnumber: '',
        status: [],
        adminFlag: [],
        startTime: '',
        endTime: '',
        memberStatus: [],
        isAuth: ''

      },
      uploadVisible: false,
      list: [],
      treeData: [],
      treeName: '',
      total: 0,
      dialogStatus: '',
      dialogFormVisible: false,
      textMap: {
        create: '新增用户',
        update: '编辑用户'
      },
      multipleSelection: [],
      defaultProps: {
        children: 'list',
        label: 'name'
      },
      checkedData: [],
      listLoading: false,
      breadList: [],
      currentNode: {},
      currentClickData: {},
      temp: {
        id: '',
        userName: '',
        userRealname: '',
        idType: 'ZJLX_SFZ',
        userIdnumber: '',
        phoneNumber: '',
        userEmail: '',
        joinMemberTime: '', // 入会时间
        userSex: 'MAN', // 默认男
        isAuth: 'RZZT01', // 默认未认证用户
        maritalStatus: 'WZ', // 默认非单身
        adminFlag: 'YHBS01', // 默认普通用户
        lockStatus: 'SDZT01', // 未锁定
        status: 'YHZT01', // 启用
        memberStatus: '',
        department: '',
        userJob: 'YHGW_JXRY'// 身份类型
      },
      dialogIdnumberVisible: false, // 修改证件号码的弹窗
      temp4Idnumber: {
        idType: 'ZJLX_SFZ',
        userIdnumber: '',
        userSex: 'MAN' // 默认男
      },
      rules4Idnumber: {
        idType: [{
          required: true,
          message: '请选择证件类型',
          trigger: 'change'
        }],
        userIdnumber: [{
          required: true,
          message: '请输入证件号码',
          trigger: 'blur'
        }],
        userSex: [{
          required: true,
          message: '请选择',
          trigger: 'change'
        }]
      },
      selectOrgTree: [{}],
      inforules: {
        password: [{
          required: true,
          message: '请输入密码',
          trigger: 'blur'
        }, {
          trigger: 'blur',
          validator: password
        }]
      },
      rules: {
        userName: [{
          required: true,
          message: '请填写用户名',
          trigger: 'blur'
        }, {
          validator: specialText,
          trigger: 'blur'
        }],
        userRealname: [{
          required: true,
          message: '请填写真实姓名',
          trigger: 'blur'
        }, {
          validator: specialText,
          trigger: 'blur'
        }],
        idType: [{
          required: true,
          message: '请选择证件类型',
          trigger: 'change'
        }],
        userIdnumber: [{
          required: true,
          message: '请输入证件号码',
          trigger: 'blur'
        }],
        phoneNumber: [{
          required: true,
          message: '请输入联系电话',
          trigger: 'blur'
        }
        ],
        userEmail: [{
          required: false,
          message: '请填写邮箱地址',
          trigger: 'blur'
        },
        {
          required: false,
          trigger: 'blur',
          validator: validateEmail
        }
        ],
        userSex: [{
          required: true,
          message: '请选择',
          trigger: 'change'
        }],
        isAuth: [{
          required: true,
          message: '请选择是否认证',
          trigger: 'change'
        }],
        maritalStatus: [{
          required: true,
          message: '请选择婚姻状况',
          trigger: 'change'
        }],
        userJob: [{
          required: true,
          message: '请选择婚姻状况',
          trigger: 'change'
        }],
        adminFlag: [{
          required: true,
          message: '请选择类型',
          trigger: 'change'
        }],
        lockStatus: [{
          required: true,
          message: '请选择',
          trigger: 'change'
        }],
        status: [{
          required: true,
          message: '请选择',
          trigger: 'change'
        }]
        // memberStatus: [{
        //   required: true,
        //   message: '请选择',
        //   trigger: 'change'
        // }]
      },
      orgList: [], // 当前企业下的部门列表
      nationList: [],
      educationList: [],
      workstatusList: [],
      hukouList: [],
      techlevelList: [],
      membershiptypeList: [],
      uploadaction: '',
      uploadHeaders: {
        'ttsxyhcs': getToken(),
        'ttsxbid': 1
      },
      uploadData: {
        isAuth: 'RZZT01',
        orgId: '',
        deptId: ''
      },
      dict: {
        ZJLX: [], // 证件类型
        RZZT: [], // 认证状态
        SDZT: [], // 锁定状态
        XB: [], // 性别
        YHBS: [], // 用户标识
        YHZT: [], // 用户状态
        HYZK: [], // 是否单身
        HYZT: [], // 会员状态
        YHGW: []// 身份类型
      },
      temporaryOrg: {},
      curNodeOrgIdOrDeptId: {
        orgId: '',
        deptId: ''
      },
      showDetail: false,
      selectItem: {}, //
      showImage: false,
      view: '/API-DOCUMENT/document/file/download?id=',
      url: '',
      statusVisible: false,
      personStatus: {
        id: '',
        status: '',
        memberStatus: '',
        memberUpdateTime: ''
      },
      personStatusRules: {
        // memberStatus: [{ required: true, message: '请选择变更状态', trigger: 'change' }],
        memberUpdateTime: [{ required: true, message: '请选择变更时间', trigger: 'change' }]
      },
      departmentOptions: [{ // TODO 暂无部门接口
        value: '1',
        label: '部门1'
      }, {
        value: '2',
        label: '部门2'
      }, {
        value: '3',
        label: '部门3'
      }, {
        value: '4',
        label: '部门4'
      }, {
        value: '5',
        label: '部门5'
      }]
    }
  },
  created() {
    this.getTreeData()
    // this.getList()
    for (const key in this.dict) {
      this.getDict(key)
    }
  },
  methods: {
    /**
     * 选择了红包配置
     * */
    selectConfig(data) {
      this.form.redpacketsActivityId = data.id
      this.form.title = data.title
      this.showDetail = false
    },
    handleCancel() {
      this.showDetail = false
    },
    /**
     * 切换性别
     */
    handleToggleSex(value) {
      // 如果在修改证件号码弹窗为true时且证件类型为身份证 或 没有修改证件号码且证件类型为身份证时需校验
      if ((this.dialogIdnumberVisible && this.temp4Idnumber.idType === 'ZJLX_SFZ' && this.temp4Idnumber.userIdnumber) || (!this.dialogIdnumberVisible && this.temp.idType === 'ZJLX_SFZ' && this.temp.userIdnumber)) {
        const UUserCard = this.dialogIdnumberVisible ? this.temp4Idnumber.userIdnumber : this.temp.userIdnumber
        const userSex = UUserCard ? parseInt(UUserCard.substr(16, 1)) % 2 === 1 ? 'MAN' : 'WOMAN' : ''
        if (userSex && userSex !== value) {
          this.$message({
            type: 'info',
            message: '所选性别与证件号码信息中性别不一致，请谨慎选择！'
          })
        }
      }
    },
    /**
     * 根据证件号码设置性别
     */
    setSex() {
      if ((this.dialogIdnumberVisible && this.temp4Idnumber.idType === 'ZJLX_SFZ' && this.temp4Idnumber.userIdnumber) || (!this.dialogIdnumberVisible && this.temp.idType === 'ZJLX_SFZ' && this.temp.userIdnumber)) {
        const UUserCard = this.dialogIdnumberVisible ? this.temp4Idnumber.userIdnumber : this.temp.userIdnumber
        if (this.dialogIdnumberVisible) {
          this.temp4Idnumber.userSex = parseInt(UUserCard.substr(16, 1)) % 2 === 1 ? 'MAN' : 'WOMAN'
        } else {
          this.temp.userSex = parseInt(UUserCard.substr(16, 1)) % 2 === 1 ? 'MAN' : 'WOMAN'
        }
      }
    },
    /**
     * 编辑用户信息修改证件号码 打开弹窗
     */
    async openIdnumberVisible() {
      for (const i in this.temp4Idnumber) {
        this.temp4Idnumber[i] = i === 'userIdnumber' ? '' : this.temp[i]
      }
      this.temp4Idnumber['userIdnumber'] = await this.idNumberIsShow(this.temp.id)
      this.dialogIdnumberVisible = true
    },
    idNumberIsShow(id) {
      const loading = this.$loading({
        lock: true,
        text: '请稍后',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.3)'
      })
      return new Promise((resolve, reject) => {
        getIdNumberIsShow({ id }).then(res => {
          loading.close()
          resolve(res.data.data ? this.handleDecrypt(res.data.data) : '')
        }).catch(() => {
          loading.close()
          resolve('')
        })
      })
    },
    /**
     * 编辑用户信息修改证件号码
     */
    updateIdnumber() {
      this.$refs['idnumberForm'].validate((valid) => {
        if (valid) {
          const reg = /^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
          if (this.temp4Idnumber.idType === 'ZJLX_SFZ' && !reg.test(this.temp4Idnumber.userIdnumber)) {
            this.$message({
              type: 'warning',
              message: '证件号码不合法！'
            })
            return
          } else if (this.temp4Idnumber.userIdnumber.length < 5) {
            this.$message({
              type: 'warning',
              message: '证件号码不得小于5位！'
            })
            return
          }
          const loading = this.$loading({
            lock: true,
            text: '请稍后',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.3)'
          })
          const userIdnumber = CryptoJS.$aesJiaM(this.temp4Idnumber.userIdnumber)
          return new Promise((resolve, reject) => {
            updateIdnumber({
              id: this.temp.id,
              userIdnumber: userIdnumber,
              idType: this.temp4Idnumber.idType,
              userSex: this.temp4Idnumber.userSex
            }).then(() => {
              loading.close()
              this.$message({
                type: 'success',
                message: '修改成功！'
              })
              for (const i in this.temp4Idnumber) {
                this.temp[i] = this.temp4Idnumber[i]
              }
              this.dialogIdnumberVisible = false
              this.getList()
            }).catch(error => {
              reject(error)
              loading.close()
            })
          })
        }
      })
    },
    /**
     * 编辑用户信息修改手机号
     */
    async updatePhoneNumber(info) {
      const phoneNumer = await this.phoneNumberIsShow(this.temp.id)
      this.$prompt('请输入新的手机号码', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        showInput: true,
        inputPattern: /(^1[0-9]\d{9}$|00000000000)/,
        inputType: 'Number',
        inputValue: phoneNumer,
        inputErrorMessage: '请输入正确的11位手机号码'
      }).then(({ value }) => {
        const loading = this.$loading({
          lock: true,
          text: '请稍后',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.3)'
        })
        const phoneNumber = CryptoJS.$aesJiaM(value)
        return new Promise((resolve, reject) => {
          updatePhone({
            id: this.temp.id,
            phoneNumber: phoneNumber
          }).then(() => {
            loading.close()
            this.$message({
              type: 'success',
              message: '修改成功！'
            })
            this.temp.phoneNumber = value
            this.getList()
          }).catch(error => {
            reject(error)
            loading.close()
          })
        })
      }).catch(() => {
      })
    },
    phoneNumberIsShow(id) {
      const loading = this.$loading({
        lock: true,
        text: '请稍后',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.3)'
      })
      return new Promise((resolve, reject) => {
        getPhoneNumberIsShow({ id }).then(res => {
          loading.close()
          resolve(resolve(res.data.data ? this.handleDecrypt(res.data.data) : ''))
        }).catch(() => {
          loading.close()
          resolve('')
        })
      })
    },
    // 密码显示隐藏
    changePasswordType() {
      this.isPassword = !this.isPassword
    },
    /**
     * 通过字典反解label
     */
    getlabelBycode(code, dictValue) {
      this.$nextTick(() => {
        if (this.dict[code]) {
          if (dictValue) {
            return this.dict[code].filter(v => v.dictValue === dictValue)[0].dictName
          } else {
            return ''
          }
        } else {
          return ''
        }
      })
    },
    /**
     * 获取字典
     */
    getDict(code) {
      return new Promise((resolve, reject) => {
        getDictByCode(code).then(response => {
          this.dict[code] = response.data.data[0].list
        }).catch(error => {
          reject(error)
        })
      })
    },
    /**
     * 解密
     */
    handleDecrypt(str) {
      return CryptoJS.$aesJieM(str)
    },
    /**
     * 解锁
     */
    handleUnlock(row) {
      if (!row.id) {
        this.$message({
          type: 'error',
          message: '编辑失败！'
        })
        return
      }
      const query = {
        id: row.id,
        lockStatus: row.lockStatus === 'SDZT02' ? 'SDZT01' : (row.lockStatus === 'SDZT01' ? 'SDZT02' : '')
      }
      this.$confirm(`此操作将${row.lockStatus === 'SDZT02' ? '解锁' : '锁定'}该用户， 是否继续?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        return new Promise((resolve, reject) => {
          update(query).then(response => {
            this.$message({
              type: 'success',
              message: `${row.lockStatus === 'SDZT02' ? '解锁' : '锁定'}成功！`
            })
            this.getList()
          }).catch(error => {
            reject(error)
          })
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消！'
        })
      })
    },
    /**
     * 企业名称查询树提供的检索方法
     */
    filterNode(value, data) {
      if (!value) return true
      return data.name.indexOf(value) !== -1
    },
    /**
     * 清空搜索企业
     */
    clearSearchTree() {
      this.treeName = ''
      this.issearchtree = false
      this.getTreeData()
    },
    /**
     * 按企业名称查询
     */
    handleFilterTree() {
      if (this.treeName === '') {
        this.issearchtree = false
        this.getTreeData()
      } else {
        this.treeLoading = true
        return new Promise((resolve, reject) => {
          roleListByName({
            name: this.treeName
          }).then(response => {
            this.treeData = response.data.data
            this.issearchtree = true
            this.treeLoading = false
          }).catch(error => {
            reject(error)
            this.issearchtree = false
            this.treeLoading = false
          })
        })
      }
    },
    getTreeData() {
      this.treeLoading = true
      return new Promise((resolve, reject) => {
        getComAndOrgTree().then(response => {
          this.treeLoading = false
          this.treeData = response.data.data
          if (this.treeData.length > 0) {
            this.$nextTick(() => {
              this.$refs.qytree.setCurrentKey(this.treeData[0].id)
              this.$refs.qytree.setCurrentKey(this.treeData[0].id)
              const node = this.$refs.qytree.getCheckedNodes()
              this.handleNodeClick(this.treeData[0], node)
            })
          }
        }).catch(error => {
          reject(error)
          this.treeLoading = false
        })
      })
    },
    /**
     * 点击修改密码
     */
    handlePassword(row) {
      this.info.password = ''
      this.info.id = row.id
      this.passwordVisible = true
    },
    /**
     * 提交修改密码
     */
    updatepassword() {
      this.$refs['infoForm'].validate((valid) => {
        if (valid) {
          const loading = this.$loading({
            lock: true,
            text: '请稍后',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.3)'
          })
          const password = CryptoJS.$aesJiaM(this.info.password)
          return new Promise((resolve, reject) => {
            updatePassword({
              id: this.info.id,
              password: password
            }).then(() => {
              this.passwordVisible = false
              loading.close()
              this.$message({
                type: 'success',
                message: '重置成功！'
              })
              this.getList()
            }).catch(error => {
              this.passwordVisible = false
              reject(error)
              loading.close()
            })
          })
        }
      })
    },
    uploadSuccess(data) {
      this.loadingUpload = false
      if (data.code === '200') {
        this.getList()
        this.uploadVisible = false
      } else {
        this.$message.error(data.msg || '批量导入失败')
        this.$refs.upload.clearFiles()
        this.getList()
        if (data.data && data.data.fileid) {
          setTimeout(() => {
            const link = document.createElement('a')
            link.style.display = 'none'
            link.href = '/API-ENTERPRISE-BACKEND/backend/sysUserLogin/downloadCheckFile' + exportSign({ errorId: data.data.fileid }).paramStr
            link.setAttribute('download', '错误信息.xls')
            link.setAttribute('target', '_blank')
            document.body.appendChild(link)
            link.click()
            document.body.removeChild(link)
          }, 1000)
        }
      }
    },
    uploadError(err) {
      this.loadingUpload = false
      this.$message.error(err || '网络异常')
      this.$refs.upload.clearFiles()
    },

    loadtree(node, resolve) {
      this.treeloading = true
      if (node.level !== 0) {
        if (node.data.deptId !== '') {
          getComAndOrgTree({
            parentId: node.data.orgId,
            deptPId: node.data.deptId
          }).then(res => {
            this.treeloading = false
            resolve(res.data.data)
          }).catch(res => {
            this.treeloading = false
            resolve([])
          })
        } else {
          getComAndOrgTree({
            parentId: node.data.id
          }).then(res => {
            this.treeloading = false
            resolve(res.data.data)
          }).catch(res => {
            this.treeloading = false
            resolve([])
          })
        }
      }
    },
    getList(obj) {
      this.listLoading = true
      var query = {
        orgId: this.curNodeOrgIdOrDeptId.orgId || '',
        deptId: this.curNodeOrgIdOrDeptId.deptId || '',
        page: obj ? obj.page : this.listQuery.page,
        pageSize: obj ? obj.limit : this.listQuery.limit
      }
      if (this.searchshow) {
        query['commonParam'] = this.listQuery.commonParam
      } else {
        query['userName'] = this.search.userName
        query['userRealname'] = this.search.userRealname
        // query['phoneNumber'] = CryptoJS.$aesJiaM(this.search.phoneNumber)
        // query['userIdnumber'] = CryptoJS.$aesJiaM(this.search.userIdnumber)
        query['phoneNumber'] = this.search.phoneNumber
        query['userIdnumber'] = this.search.userIdnumber
        query['startTime'] = this.search.startTime
        query['endTime'] = this.search.endTime
        query['status'] = this.search.status.length > 0 ? this.search.status.join(',') : ''
        query['adminFlag'] = this.search.adminFlag.length > 0 ? this.search.adminFlag.join(',') : ''
        // query['memberStatus'] = this.search.memberStatus.length && this.search.memberStatus.join(',') || ''
        query['isAuth'] = this.search.isAuth || ''
      }
      return new Promise((resolve, reject) => {
        getUserList(query).then(response => {
          this.list = response.data.data.rows
          this.total = response.data.data.total
          this.listLoading = false
        }).catch(error => {
          reject(error)
          this.listLoading = false
        })
      })
    },
    resetTemp() {
      this.temp = {
        id: '',
        userName: '',
        userRealname: '',
        idType: 'ZJLX_SFZ',
        userIdnumber: '',
        phoneNumber: '',
        userEmail: '',
        joinMemberTime: '',
        userSex: 'MAN', // 默认男
        isAuth: 'RZZT01', // 默认未认证用户
        maritalStatus: 'WZ', // 默认非单身
        adminFlag: 'YHBS01', // 默认普通用户
        lockStatus: 'SDZT01', // 未锁定
        status: 'YHZT01' // 启用
        // memberStatus: 'HYZT_ZS'
      }
    },
    handleDownload() {
      if (document.getElementById('downloadLinkFile')) {
        const dom = document.getElementById('downloadLinkFile')
        document.body.removeChild(dom)
      }
      const link = document.createElement('a')
      link.setAttribute('id', 'downloadLinkFile')
      link.style.display = 'none'
      link.href = '/API-ENTERPRISE-BACKEND/backend/sysUserLogin/downloadTemplate' + exportSign().paramStr
      link.setAttribute('download', '用户批量导入模板.xlsx')
      link.setAttribute('target', '_blank')
      document.body.appendChild(link)
      link.click()
      document.body.removeChild(link)
    },
    handleFilter() {
      this.listQuery.page = 1
      // this.search.isSearch = 1 // 暂时屏蔽全局搜索人员
      this.getList()
    },
    resettingBtn() {
      this.listQuery.commonParam = ''
      for (const i in this.search) {
        if (this.search['' + i + ''] instanceof Array) {
          this.search['' + i + ''] = []
        } else {
          this.search['' + i + ''] = ''
        }
      }
      this.listQuery.page = 1
      this.getList()
    },
    /**
     * 获取当前树节点和其父级节点
     */
    getTreeNode(Node) {
      if (Node) {
        if (Node.label !== undefined) {
          this.breadList.unshift(Node.label) // 在数组头部添加元素
          this.getTreeNode(Node.parent) // 递归
        }
      }
    },
    // 点击树
    handleNodeClick(data, Node) {
      this.breadList = []
      this.getTreeNode(Node)
      this.currentNode = Object.assign({}, data)
      this.selectOrgTree = [{
        orgId: data.id,
        name: data.name
      }]
      this.curNodeOrgIdOrDeptId = {
        orgId: data.orgId || '',
        deptId: data.deptId || ''
      }
      this.resettingBtn()
      this.isShow = true
    },
    getParentId(id) {
      const node = this.$refs.qytree.getNode(id)
      if (node && node.data && node.data.type === 'com') {
        return node.data
      } else if (node && node.data) {
        return this.getParentId(node.parent.data.id)
      } else {
        return ''
      }
    },

    handleUpload() {
      if (this.currentNode.deptId) {
        this.uploadaction = '/API-ENTERPRISE-BACKEND/backend/sysUserLogin/importMembers'
      } else {
        this.uploadaction = '/API-ENTERPRISE-BACKEND/backend/sysUserLogin/importMembersAboutDept'
      }
      this.uploadData.orgId = this.currentNode.orgId || ''
      this.uploadData.deptId = this.currentNode.deptId || ''
      this.uploadVisible = true
      this.$nextTick(() => {
        this.$refs.upload.clearFiles()
      })
    },
    uploadSubmit() {
      this.$set(this, 'uploadHeaders', importSign(this.uploadHeaders, this.uploadData))
      this.$refs.upload.submit()
      this.loadingUpload = true
    },
    /**
     * 导出人员
     */
    handleExport() {
      const query = {
        orgId: this.curNodeOrgIdOrDeptId.orgId || '',
        deptId: this.curNodeOrgIdOrDeptId.deptId || ''
      }
      if (this.searchshow) {
        query['commonParam'] = this.listQuery.commonParam
      } else {
        query['userName'] = this.search.userName
        query['userRealname'] = this.search.userRealname
        query['phoneNumber'] = this.search.phoneNumber
        query['userIdnumber'] = this.search.userIdnumber
        query['startTime'] = this.search.startTime
        query['endTime'] = this.search.endTime
        query['status'] = this.search.status.length > 0 ? this.search.status.join(',') : ''
        query['adminFlag'] = this.search.adminFlag.length > 0 ? this.search.adminFlag.join(',') : ''
        // query['memberStatus'] = this.search.memberStatus.length && this.search.memberStatus.join(',') || ''
        query['isAuth'] = this.search.isAuth || ''
      }
      for (const i in query) {
        if (query[i] === '') {
          delete query[i]
        }
      }
      exportCheck('USER_MANAGE', '', exportUser, noMaskExportUser, exportSign(query).obj, '人员信息.xlsx')
    },

    handleDeletes() {
      const arrid = []
      if (this.multipleSelection.length > 0) {
        this.multipleSelection.forEach(item => {
          arrid.push(item.id)
        })
        const ids = arrid.join(',')
        this.$confirm('此操作将永久删除所选数据, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.deleteUser(ids)
        }).catch(() => {
        })
      } else {
        this.$message({
          message: '请选择需要删除的数据！',
          type: 'warning'
        })
      }
    },
    handleDelete(row) {
      this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.deleteUser(row.id)
      }).catch(() => {
      })
    },
    deleteUser(ids) {
      del(ids).then(() => {
        this.$message({
          type: 'success',
          message: '删除成功！'
        })
        this.getList()
      })
    },
    // 点击新增人员
    handleCreate() {
      this.dialogStatus = 'create'
      this.dialogFormVisible = true
      this.resetTemp()
      this.$nextTick(() => {
        this.$refs['dataForm'].clearValidate()
        this.selectOrgTree = [{
          orgId: this.currentNode.orgId || '',
          deptId: this.currentNode.deptId || '',
          name: this.currentNode.name
        }]
        this.temporaryOrg = this.selectOrgTree
      })
    },
    // 新增
    createData() {
      if (!this.selectOrgTree[0].deptId && this.temp.isAuth === 'RZZT03') {
        this.$message({
          message: '已认证用户必须选择部门！',
          type: 'warning'
        })
        return
      }
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          const loading = this.$loading({
            lock: true,
            text: '请稍后',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.3)'
          })
          const query = {
            ...this.temp,
            ...this.curNodeOrgIdOrDeptId
          }
          query.userIdnumber = CryptoJS.$aesJiaM(this.temp.userIdnumber)
          query.phoneNumber = CryptoJS.$aesJiaM(this.temp.phoneNumber)
          if (this.selectOrgTree.length > 0) {
            if (this.selectOrgTree[0].id === this.selectOrgTree[0].orgId) {
              query['orgId'] = this.selectOrgTree[0].orgId
            } else {
              query['deptId'] = this.selectOrgTree[0].deptId || -1
              query['orgId'] = this.selectOrgTree[0].orgId
            }
          }
          return new Promise((resolve, reject) => {
            create(query).then((res) => {
              this.dialogFormVisible = false
              loading.close()
              this.$alert('用户创建成功，未设置初始密码，为了用户账号安全，请尽快联系用户设置密码～', '创建成功', {
                confirmButtonText: '确定',
                callback: action => {
                  this.getList()
                }
              })
            }).catch(error => {
              loading.close()
              reject(error)
            })
          })
        }
      })
    },
    // 编辑
    handleUpdate(row) {
      if (row.id) {
        return new Promise((resolve, reject) => {
          getDetail(row.id).then((res) => {
            for (const i in this.temp) {
              this.temp[i] = res.data.data[i]
            }
            this.$set(this.temp, 'virtualAccount', res.data.data.virtualAccount)
            this.temp.userIdnumber = this.temp.userIdnumber ? CryptoJS.$aesJieM(this.temp
              .userIdnumber) : ''
            this.temp.phoneNumber = this.temp.phoneNumber ? CryptoJS.$aesJieM(this.temp
              .phoneNumber) : ''
            this.dialogStatus = 'update'
            this.selectOrgTree = [{
              orgId: res.data.data.orgId || '',
              deptId: res.data.data.deptId || '',
              name: res.data.data.deptName || ''
            }]
            // this.temp.memberStatus = row.memberStatus
            this.dialogFormVisible = true
            this.$nextTick(() => {
              this.$refs['dataForm'].clearValidate()
            })
          }).catch(error => {
            reject(error)
          })
        })
      } else {
        this.$message({
          message: '获取数据失败！',
          type: 'warning'
        })
      }
    },
    updateData() {
      if (!this.selectOrgTree[0].deptId && this.temp.isAuth === 'RZZT03') {
        this.$message({
          message: '已认证用户必须选择部门！',
          type: 'warning'
        })
        return
      }
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          const loading = this.$loading({
            lock: true,
            text: '请稍后',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.3)'
          })
          const tempData = Object.assign({}, this.temp)
          delete tempData.userIdnumber
          delete tempData.phoneNumber
          delete tempData.idType
          delete tempData.userSex
          if (this.selectOrgTree.length > 0) {
            if (this.selectOrgTree[0].id === this.selectOrgTree[0].orgId) {
              tempData['orgId'] = this.selectOrgTree[0].orgId
            } else {
              tempData['deptId'] = this.selectOrgTree[0].deptId || -1
              tempData['orgId'] = this.selectOrgTree[0].orgId
            }
          }
          return new Promise((resolve, reject) => {
            update(tempData).then(() => {
              this.dialogFormVisible = false
              loading.close()
              this.$message({
                type: 'success',
                message: '编辑成功！'
              })
              this.getList()
            }).catch(error => {
              // this.temp.userIdnumber = CryptoJS.$aesJieM(this.temp.userIdnumber || '')
              // this.temp.phoneNumber = CryptoJS.$aesJieM(this.temp.phoneNumber || '')
              reject(error)
              loading.close()
            })
          })
        }
      })
    },
    handleSelectionChange(arr) {
      this.multipleSelection = arr
    },

    /*
     * 打开组织树
     * */
    OpenOrgTreedialog() {
      this.OrgTreedialog = true
      this.$nextTick(() => {
        this.$refs.showOrgTree.selectData = this.selectOrgTree[0].orgId === this.selectOrgTree[0]
          .deptId || this.selectOrgTree[0].deptId === '' ? this.selectOrgTree[0].orgId : this
            .selectOrgTree[0].deptId
        this.$refs.showOrgTree.clearSearchTree()
        this.$refs.showOrgTree.echo()
      })
    },
    // 勾选组织
    selectOrg(val) {
      this.temporaryOrg = [val]
    },
    /*
     * 确定组织
     * */
    saveOrg() {
      this.OrgTreedialog = false
      this.temp.orgId = this.temporaryOrg.id
      this.selectOrgTree = this.temporaryOrg
    },
    /** *
     * 给人员分配可管理的部门
     * @param row
     */
    handleAuthority(row) {
      this.selectItem = row
      this.showDetail = true
    },

    // 查询会员状态
    queryStatus(row) {
      this.statusVisible = true
      this.personStatus = {
        memberUpdateTime: row.memberUpdateTime || parseTime(new Date()),
        status: row.memberStatusValue,
        id: row.id
        // memberStatus: row.memberStatus
      }
      this.$nextTick(() => {
        this.$refs['personStatus'].clearValidate()
      })
    },
    // 修改会员状态
    handleChangeStatus() {
      this.$refs.personStatus.validate((vlidate) => {
        if (vlidate) {
          const parmas = {
            memberUpdateTime: this.personStatus.memberUpdateTime,
            id: this.personStatus.id
            // memberStatus: this.personStatus.memberStatus
          }
          upDataStatusPerson(parmas).then(
            res => {
              if (res.data.code === '200' || res.data.code === 200) {
                this.statusVisible = false
                this.$message({ type: 'success', message: res.data.data })
                this.getList()
              }
            }
          ).catch(err => { console.log(err) })
        }
      })
    }
  }
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" type="text/scss">
// eslint-disable-next-line

$dark_gray: #bfced6;
#enterpriseuser {
  height: calc(100vh - 60px);
  padding: 0;
  overflow-y: hidden;

  .vue-splitter-container {
    width: 100%;
    overflow: hidden;
  }

  .treeBox {
    padding: 10px;
    margin-right: 0;
    background: #ffffff;
    height: 100%;
    background: #fff;
    overflow-y: auto;

    .search-tree-wrap {
      display: flex;
      justify-content: space-between;
      align-items: center;

      .tree-filter {
        padding: 10px 18px;
      }
    }
  }

  .leftWrap {
    background: #fff;

    padding: 10px;

    .search-tree-wrap {
      display: flex;
      justify-content: space-between;
      align-items: center;

      .tree-filter {
        padding: 10px 18px;
      }
    }

    .el-tree-node__content {
      margin-top: 10px;
    }

    .tag {
      font-size: 12px;
      border-radius: 4px;
      padding: 2px 4px;
      color: #fff;

      &.gh {
        color: #ff7474;
        border: 1px solid #ff7474;
      }

      &.qy {
        color: #2fbcfb;
        border: 1px solid #2fbcfb;
      }

      &.bm {
        color: #ffa11c;
        border: 1px solid #ffa11c;
      }
    }

    .el-tree-node__expand-icon.expanded {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
    }

    .el-icon-caret-right:before {
      content: '\E7A0';
      font-size: 14px;
    }

    .el-tree-node__expand-icon.expanded.el-icon-caret-right:before {
      content: '\E7A2';
      font-size: 14px;
    }
  }

  .user-main {
    height: 100%;
    background: #fff;
    overflow-y: auto;
    padding: 10px;
    position: relative;

    .ts-con {
      position: absolute;
      top: 10px;
      left: 10px;
      right: 10px;
      bottom: 10px;
      background: white;

      .ts {
        line-height: 30px;
        position: absolute;
        left: 50%;
        top: 50%;
        margin-top: -15px;
        margin-left: -110px;
        width: 210px;
        text-align: center;
        background: white;
        border-radius: 2px;
        box-shadow: 1px 1px 5px #e0dbdb;
        font-size: 14px;
        font-family: Microsoft Yahei In-Bold, Microsoft Yahei,
        Apple LiGothic Medium;
        color: #222222;
      }
    }

    &::-webkit-scrollbar {
      display: none;
    }

    .upPassword {
      .hide {
        display: inline-block;
        width: 17px;
        height: 17px;
        background-image: url('../images/hide.png');
        background-size: 100%;
        margin-top: 10px;
        cursor: pointer;
        margin-right: 5px;
      }

      .show {
        display: inline-block;
        width: 17px;
        height: 17px;
        background-image: url('../images/show.png');
        background-size: 100%;
        margin-top: 10px;
        cursor: pointer;
        margin-right: 5px;
      }
    }
  }
}

#enterprise-usermanage {
  background-color: #ffffff;
  height: 100%;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), 0 0 6px 0 rgba(0, 0, 0, 0.04);
  padding: 10px;
  overflow-y: auto;

  &::-webkit-scrollbar {
    display: none;
  }

  .course-search {
    background-color: #fff;
    padding: 0 10px;

    .svg-container {
      padding: 0 5px 0 10px;
      color: $dark_gray;
      vertical-align: middle;
      display: inline-block;

      &_login {
        font-size: 10px;
      }
    }

    .search-input {
      width: 40%;
      position: relative;

      &:after {
        content: '';
        position: absolute;
        left: -25px;
        right: 0;
        bottom: 8px;
        height: 1px;
        background: rgba(226, 227, 232, 1);
      }

      input {
        outline: none;
        background: transparent;
        border: none;
        outline: medium;
        padding: 0;

        &:focus {
          outline: none;
          background-color: transparent;
        }
      }
    }

    .course-search-btn {
      display: inline-block;
      float: right;

      .el-button.is-round {
        padding: 10px 30px;
        margin-right: 34px;
      }

      .course-search-more {
        font-size: 14px;
        font-weight: 500;
        @include font-color($mainColor);
        cursor: pointer;
        margin-left: 10px;
      }
    }

    &.merge {
      height: 50px;
      line-height: 50px;
    }

    &.separate {
      .course-search-inner {
        padding-top: 10px;

        .search-inner-item {
          .item-label {
            height: 30px;
            line-height: 30px;
            font-size: 14px;
            color: #a6a6a6;
            font-weight: 400;
          }

          .el-checkbox__label {
            font-weight: 400;
          }

          .el-input {
            position: relative;

            .el-input__inner {
              border: none;
              padding: 0;
            }

            &:after {
              content: '';
              height: 1px;
              background-color: #e2e3e8;
              position: absolute;
              left: 0;
              right: 0;
              bottom: 0;
            }
          }
        }
      }

      .course-search-btn {
        text-align: center;
        display: block;
        float: none;
        height: 56px;
        line-height: 56px;
      }
    }
  }

  .btn-container {
    display: flex;
    height: 36px;
    line-height: 36px;
    margin-top: 15px;
    margin-bottom: 15px;

    .btn-container-title {
      flex: 1;
      height: 36px;
      line-height: 36px;
      font-size: 16px;
      color: rgba(51, 51, 51, 1);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;

      .btn-container-title-select {
        @include font-color($mainColor);
      }
    }
  }

  .el-table {
    height: calc(100% - 40px);
    overflow-y: auto;

    &::-webkit-scrollbar {
      display: none;
    }
  }

  .dataForm {
    .el-select {
      width: 100%;
    }
  }

  .upload-model {
    text-align: center;
  }
  .image-preview .el-dialog__body {
    text-align: center;
    .image-box {
      width: 200px;
      height: 80px;
      border: 2px dashed #ff9f91;
      border-radius: 5px;
    }
  }

}
</style>
